<template>
    <div>
        <dialog-alert :data="alertData" @on-close="onCloseAlert()" @on-confirm="onConfirm()">
            <div class="dialog-alert">
                <div>新标签(如果添加多个标签，标签之间请用'、'隔开)：</div> 
                <div><el-input v-model="label"></el-input></div>
            </div>
        </dialog-alert>
    </div>
</template>

<script setup lang="ts">
import { handleElCascaderOptions, handleTypeLidID } from "@/utils/util"
import { ElMessage } from "element-plus"
import { onMounted, ref, toRefs } from "vue"
import manageTypeLabelStore from "../../manage-type-label.store"

const manageTypeLabelSe = manageTypeLabelStore()

const props = defineProps({
    tid: {
        type: Number,
        default: -1
    }
})
const { tid } = toRefs(props)

const emits = defineEmits(['closeAddLabelAlert'])
// 添加诗歌信息
const alertData = {
    title: '添加新标签',
    confirmTitle: '添加',
    isShowCancleBtn: true,
    cancleTitle: '取消',
    isShowClose: true,
}
// 点击取消/关闭
const onCloseAlert = () => {
    emits('closeAddLabelAlert', false)
}
// 点击添加
let label = ref<string>('')
const onConfirm = () => {
    if(label.value == '') {
        ElMessage({
            showClose: true,
            message: '请输入新的标签名称',
            type: 'error',
        })
        return
    }
    const data = {
        tid: tid.value,
        label: label.value
    }
    manageTypeLabelSe.getAddNewLabelByTid(data).then((res: any) => {
        if(res.status == 'success') {
            emits('closeAddLabelAlert', true)
        } else {
            ElMessage({
                showClose: true,
                message: '添加失败',
                type: 'error',
            })
        }
    })
}
</script>

<style lang="less" scoped>

</style>